<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>角色分配资源</title>
    <%include("/WEB-INF/views/common/basejs.html"){}%>
    <!--引入ztree相关资源-->
    <script src="${ctxPath!}/js/base/jquery-1.8.3.min.js"></script>
    <link rel="stylesheet" type="text/css" media="screen" href="${ctxPath!}/js/zTree_v3/css/metroStyle/metroStyle.css">
    <!--<script type="text/javascript" src="${ctxPath!}/js/zTree_v3/js/jquery-1.4.4.min.js"></script>-->
    <script type="text/javascript" src="${ctxPath!}/js/zTree_v3/js/jquery.ztree.core.min.js"></script>
    <script type="text/javascript" src="${ctxPath!}/js/zTree_v3/js/jquery.ztree.excheck.min.js"></script>
    <script>
        var layer;
        var resourceTree;
        var roleResource='${roleResourceList!}';
        layui.use(['layer'],function(){
            layer=layui.layer;
           $(function(){
               initResourceTree();
           });

        })

        function initResourceTree(){
            //查询有效的部门
            var conditions=[];
            var param={};
            param.columnName="status";
            param.value="1";
            conditions.push(param);
            var setting = {
                //简单的数据list
                data:{
                    simpleData: {
                        enable: true,
                        idKey: "id",
                        pIdKey: "pid",
                        rootPId: null
                    },
                    key:{ name:"resourceName" ,value:"id" }
                },
                check:{
                   enable:true,
                    chkStyle:"checkbox",
                    chkboxType:{ "Y": "ps", "N": "s"}
                },
                view: {
                    showLine: false,
                    showIcon: false
                },
                async: {
                    enable: true,
                    type: 'post',
                    url: basePath + "/resource/getList",
                    dataType:"JSON",
                    otherParam: { "conditions":JSON.stringify(conditions)},
                    dataFilter:function(treeId, parentNode, responseData){
                        if(roleResource){
                            roleResource=JSON.parse(roleResource);
                            for(i in roleResource){
                                for(j in responseData){
                                    if(roleResource[i].resourceId==responseData[j].id){
                                        responseData[j].checked=true;
                                        break;
                                    }
                                }
                            }
                        }
                        return responseData;
                    }
                },
                callback: {
                    onClick: function (event, treeId, treeNode) {
                        console.log(treeNode);
                    },
                    onAsyncSuccess: function(){//默认展开所有节点
                        resourceTree.expandAll(true);
                    }
                }
            };
            resourceTree=$.fn.zTree.init($("#resourceTree"),setting);
        }
        function selectAll(){
            resourceTree.checkAllNodes(true);
        }
        function clearAll(){
            resourceTree.checkAllNodes(false);
        }
        function startGrant(){
            var nodes = resourceTree.getCheckedNodes(true);
            layer.confirm("确定分配资源？", {icon: 3, title:'提示'},
                function(index){//确定回调
                     layer.close(index);
                     var resourceIds=[];
                     for(var i=0;i<nodes.length;i++){
                         resourceIds.push(nodes[i].id);
                     }
                    $.ajax({
                        url:basePath+'/role/grantResourceToRole',
                        type:'post',
                        data:{resourceIds:JSON.stringify(resourceIds),roleId:'${role.id}'},
                        dataType:'json',
                        success:function(data){
                            window.parent.closeGrantPage();
                            window.parent.layer.msg(data.msg);
                        },
                        error:function(){
                            window.parent.closeGrantPage();
                            window.parent.layer.msg("系统内部错误");
                        }
                    });
                },function (index) {//取消回调
                    layer.close(index);
                }
            );
        }
    </script>
</head>
<body class="layui-layout-body" style="overflow-y:scroll">
    <div class="layui-container">
        <fieldset class="layui-elem-field layui-field-title">
            <legend>资源分配>>>${role.roleName}</legend>
            <div class="layui-field-box">
                <div class="layui-btn-container">
                    <button onclick="selectAll()" class="layui-btn layui-btn-sm layui-btn-normal">全选</button>
                    <button onclick="clearAll()" class="layui-btn layui-btn-sm layui-btn-warm">清空</button>
                    <button onclick="startGrant()" class="layui-btn layui-btn-sm layui-btn-danger">授权</button>
                </div>
                <ul id="resourceTree" class="ztree">

                </ul>
            </div>
        </fieldset>

    </div>
</body>
</html>